<ul>
  <li><%= link_to 'Alice', page_path(id: 0) %></li>
  <li><%= link_to 'Bob', page_path(id: 1) %></li>
</ul>

<div id='component-parent'>
  <%= react_component 'GreetingMessage', { name: @name, lastName: "Last #{@name}", info: { name: @name, lastName: "Last #{@name}" } }, { id: 'component', class: "greeting-message", prerender: @prerender } %>
  <ul>
    <%= react_component 'Todo', { todo: 'Another Component' }, { id: 'todo', prerender: @prerender } %>
  </ul>
</div>

<button onClick="ReactRailsUJS.unmountComponents('#component-parent')">Unmount by parent selector</button>
<button onClick="ReactRailsUJS.mountComponents('#component-parent')">Mount by parent selector</button>

<button onClick="ReactRailsUJS.unmountComponents('#component')">Unmount by own selector</button>
<button onClick="ReactRailsUJS.mountComponents('#component')">Mount by own selector</button>

<button onClick="ReactRailsUJS.unmountComponents(document.querySelector('#component-parent'))">Unmount by parent node</button>
<button onClick="ReactRailsUJS.mountComponents(document.querySelector('#component-parent'))">Mount by parent node</button>
